<!doctype html>
<meta charset="utf-8">
<title>Async Clipboard.read() should not trigger resource loading</title>
<link rel="help" href="https://w3c.github.io/clipboard-apis/#dom-clipboard-read">
<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1315563">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
<script src="resources/user-activation.js"></script>

<body>Body needed for test_driver.click()
<p><button id="button">Put payload in the clipboard</button></p>
<div id="output"></div>

<script>
button.onclick = () => document.execCommand('copy');
document.oncopy = ev => {
  ev.preventDefault();
  ev.clipboardData.setData(
      'text/html',
      '<img src="https://example.com/oops">');
};

promise_test(async test => {
  let loadObserved = false;
  const observer = new PerformanceObserver(() => loadObserved = true);
  observer.observe({type: 'resource'});
  await tryGrantReadPermission();
  await test_driver.click(button);

  await waitForUserActivation();
  const items = await navigator.clipboard.read();
  const htmlBlob = await items[0].getType("text/html");
  const html = await htmlBlob.text();

  assert_equals(html, '<img src="https://example.com/oops">');

  // Allow resource loading to start asynchronously
  await new Promise(resolve => test.step_timeout(resolve, 100));
  assert_false(loadObserved, 'Should not observe resource loading');
});
</script>
</body>
